<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no" />
		<title>首页</title>
		<link rel="stylesheet" type="text/css" href="../c/aui.css" />
		<link rel="stylesheet" type="text/css" href="../c/suxiangw.css" />
		<style>
			body{
				 background-color:transparent;
				 background: #000;
			}
			#sx-footer{
				border-top:0.05rem solid #232323;
			}
			#sx-header{
				/*background: url('../i/fang/top.png');*/
				background-repeat: no-repeat;
				background-size: cover;
				/*background: #f00;*/
			}
			.nav{
				/*background: #f00;*/
				height: 2rem;
			}
			#sx-header .aui-btn{
				/*background: #f00 !important;*/
				padding: 0 1rem;
			}
			#sx-header img{
				width: 1rem;
			}
		</style>
	</head>
	<body>
		<header class="aui-bar aui-bar-nav" id="sx-header">
			<a class="aui-pull-right aui-btn" tapmode onclick="s()"><img src="../i/sou.png" /></a>
		</header>
		<footer class="aui-bar aui-bar-tab" id="sx-footer">
			<div class="aui-bar-tab-item" tapmode onclick="_index_win('index')">
				<div class="aui-bar-tab-label">
					首页
				</div>
			</div>
			<!-- <div class="aui-bar-tab-item aui-active" id="article" tapmode onclick="_shuaxin('fang')">
				<div class="aui-bar-tab-label">
					放映厅
				</div>
				<em></em>
			</div> -->
			<div class="aui-bar-tab-item" tapmode onclick="_index_win('fabu')">
				<img style="width: 2.2rem;" src="../i/add.png" />
			</div>
			<!-- <div class="aui-bar-tab-item" id="renwu" tapmode onclick="_index_win('renwu')">
				<div class="aui-bar-tab-label">
					任务
				</div>
				<div class="aui-badge aui-hide"></div>
			</div> -->
			<!-- <div class="aui-bar-tab-item" tapmode onclick="_index_win('article')">
				<div class="aui-bar-tab-label">
					社交
				</div>
			</div> -->
			<div class="aui-bar-tab-item" tapmode onclick="_index_win('member')">
				<div class="aui-bar-tab-label">
					我的
				</div>
			</div>
		</footer>
	</body>
	<script type="text/javascript" src="../j/api.js"></script>
	<script type="text/javascript">
		var index
		apiready = function() {
			header = $api.byId('sx-header');
			$api.fixStatusBar(header);
			NVNavigationBar = api.require('NVNavigationBar');
			typeid_data = _getPrefs('_config').fang;
			// console.log(JSON.stringify(typeid_data.top));
			type();
		}
		// 中间分类
		function type() {
			var _this = $('#sx-header .aui-btn');
			NVNavigationBar.open({
				rect : {
					x : 0,
					y : _this.offset().top,
					w : api.winWidth- _this.width(),
					h : _this.height()
				},
				styles : {
					orientation : 'horizontal',
					bg : 'rgba(0,0,0,0)',
					bgAlpha : 1,
					font : {
						size : 16,
						sizeSelected : 20,
						color : 'rgba(255,255,255,0.7)',
						colorSelected : 'rgba(255,255,255,0.9)',
						alpha : 1
					},
					itemSize : {
						w : 50,
						h : $('#sx-header div').height()
					},
					bounces : true,
				},
				items : typeid_data,
				selectedIndex : 0,
				fixedOn : api.frameName,
				id : 'article'
			}, function(ret, err) {
				if (ret.eventType == 'click') {
						if(ret.index == index){
							shuaxin();
							return;
						}
						api.setFrameGroupIndex({
							name : 'article',
							index : ret.index,
							scroll : true, //是否平滑滚动至目标窗口，即是否带有动画
						});
				}
			});
			var frames = [];
			var url = ['fang','fang_type','fang_type','fang_type','fang_type'];
		//	console.log(JSON.stringify(typeid_data))
			for (var i = 0; i < typeid_data.length; i++) {
				var frame = {};
				frame.name = 'fang_' + i;
				frame.url = _h_w + url[i] +'.html';
				frame.pageParam = {
					i : i,
					typeid:typeid_data[i]
				};
				frames.push(frame);
			}
			openFrameGroup(frames)
		}
		function openFrameGroup(frames) {
			// console.log(JSON.stringify(frames))
			var headerPos = $api.offset(header);
			var body_h = api.frameHeight;
			$api.fixTabBar($api.byId('sx-footer'))
			var footerh = $api.offset($api.byId('sx-footer')).h;
			asdasd = body_h - headerPos.h - footerh;
			api.openFrameGroup({
				name : 'article',
				scrollEnabled : true,
				bounces : true,
				rect : {
					x : 0,
					y : headerPos.h,
					w : 'auto',
					h : asdasd,
				},
				index : 0,
				frames : frames,
				preload : 0,	// 预加载的 frame 个数，默认加载当前页后面一个
			}, function(ret, err) {
				index = ret.index;
				NVNavigationBar.setSelected({
					id : 'article',
					index : ret.index,
					selected : true
				});
				//active(index)
			});
		}
		function shuaxin(){
			api.execScript({
	        frameName: 'article_'+index,
	        script: 'api.refreshHeaderLoading();'
	    });
		}
		function s(){
			// 搜索
			var UISearchBar = api.require('UISearchBar');
			UISearchBar.open({
				placeholder: '请输入搜索关键字',
				historyCount: 10,
				showRecordBtn: false,
				texts: {
					cancelText: '取消',
					clearText: '清除搜索记录'
				},
				styles: {
					navBar: {
						bgColor: '#161823',
						borderColor: '#161823'
					},
					searchBox: {
						color: '#000',
						height: 44,
					},
					cancel: {
						bg: 'rgba(0,0,0,0)',
						color: '#f00',
						size: 16
					},
					list: {
						color: '#fff',
						bgColor: '#161823',
						borderColor: '#161823',
						activeBgColor: '#161823',
						size: 16
					},
					clear: {
						color: '#90929E',
						borderColor: '#161823',
						size: 16
					}
				}
			}, function(ret, err) {
				if (ret) {
					// console.log(JSON.stringify(ret));
					if (ret.text) {
						_url({
							url: 'fang_list',
							title: '搜索 ' + ret.text,
							text: ret.text
						})
					}
				} else {
					// console.log(JSON.stringify(err));
				}
			});
		}
	</script>
</html>
